<template>
	<view class="page-photo-print">
		<view class="poster-list">
			<image v-for="item in list" :key="item.id" class="poster-item" :src="item.image" mode="widthFix" @tap="onTapItem(item)"></image>
		</view>

	</view>


</template>

<script setup>
	import {
		ref,
		reactive
	} from "vue";
	const list = [{
		id: '1',
		image: 'https://sspzjz.oss-cn-shanghai.aliyuncs.com/photo/print/zhengjz.png',
		page: '/pages/photo-print/photo-print-credit',
	}, {
		id: '2',
		image: 'https://sspzjz.oss-cn-shanghai.aliyuncs.com/photo/print/shenhuozhao.png',
		page: '/pages/photo-print/photo-print-life',
	}];

	const onTapItem = (item) => {
		uni.navigateTo({
			url: item.page,
		})
	}
</script>

<style lang="scss" scoped>
	.page-photo-print {
		min-height: 100vh;
		background: rgba(245, 245, 245, 1);
		.poster-list {
			display: flex;
			flex-direction: column;
			gap: 40rpx;
			padding: 40rpx 32rpx;

			.poster-item {
				width: 100%;
				height: 386rpx;
				border-radius: 16rpx;
				box-shadow: 0px 2rpx 4rpx rgba(0, 0, 0, 0.02);

			}
		}
	}
</style>